<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width" />
    <title>Remote Connection</title>
    <link th:href="@{/layui/css/layui.css}" rel="stylesheet">
    <script type="text/javascript" th:src="@{/layui/jquery-3.5.1.min.js}"></script>
    <script type="text/javascript" th:src="@{/layui/layui.js}"></script>
    <link rel="stylesheet" th:href="@{/css/index.css}" />
    <link rel="icon" th:href="@{/images/favicon.ico}" type="image/x-icon" />
    <link rel="shortcut icon" th:href="@{/images/favicon.ico}" type="image/x-icon" />
    <link rel="stylesheet" th:href="@{/css/xadmin.css}">
    <script type="text/javascript" th:src="@{/js/xadmin.js}"></script>
</head>
<body>

<div class="main">

    <input type="hidden" th:value="${suffix}" id="suffix"/>
    <input type="hidden" th:value="${requestUrl}" id="requestUrl" />
    <input type="hidden" th:value="${webSocketHostPort}" id="webSocketHostPort" />
    <!--导航区域-->
    <div class="layui-row">
        <ul class="layui-nav" id="nav">
            <li class="layui-nav-item">
                <a href="#" >连接数:<span class="layui-badge layui-bg-green" id="connectCount">
                    <i class="layui-icon layui-icon-loading"></i>
                </span></a>
            </li>
            <li class="layui-nav-item">
                <a href="#" >连接时间:<span class="layui-badge layui-bg-green" th:text="${time+'ms'}"></span></a>
            </li>
            <li class="layui-nav-item" style="margin-left: 25px;">
                <a href="#" >运行状态:<span style="width: 24px;" id="errMsg">
                    <i  class="layui-badge layui-bg-green layui-icon layui-icon-loading"></i>
                </span></a>
            </li>

            <li class="layui-nav-item" style="margin-left: 20px;">
                <a href="#" >
                    <span id="principalHost" th:text="${host}"></span>
                    <span class="layui-badge-dot layui-bg-green"></span>
                </a>
            </li>

            <li class="layui-nav-item" id="selectCommand" >
                <a href="#" >查看命令
                    <svg t="1641989832826" style="width: 1.5em;height: 1.5em;margin-bottom: -5px;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1640" width="200" height="200"><path d="M810.666667 213.333333a42.666667 42.666667 0 0 1 42.666666 42.666667v512a42.666667 42.666667 0 0 1-42.666666 42.666667H213.333333a42.666667 42.666667 0 0 1-42.666666-42.666667V256a42.666667 42.666667 0 0 1 42.666666-42.666667h597.333334z m0 42.666667H213.333333v512h597.333334V256z m-106.666667 362.666667a21.333333 21.333333 0 1 1 0 42.666666h-170.666667a21.333333 21.333333 0 1 1 0-42.666666h170.666667zM304.896 376.064a21.333333 21.333333 0 0 1 30.208 0l120.661333 120.661333a21.333333 21.333333 0 0 1 0 30.165334l-120.661333 120.704a21.333333 21.333333 0 1 1-30.208-30.208l105.6-105.557334L304.896 406.186667a21.333333 21.333333 0 0 1 0-30.165334z" fill="#009688" p-id="1641"></path></svg>
                </a>
            </li>



            <li class="layui-nav-item" style="margin-left: -15px;">
                <a th:href="@{/loginOut}">安全退出
                   <svg t="1641990591114" style="width: 1.5em;height: 1.5em;margin-bottom: -5px;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5382" width="200" height="200"><path d="M639.488 863.232H198.144c-8.704 0-15.36-6.656-15.36-15.36V362.496c0-111.104 90.624-201.728 201.728-201.728h441.344c8.704 0 15.36 6.656 15.36 15.36v485.888c-0.512 111.104-91.136 201.216-201.728 201.216z m-425.984-30.72h425.472c93.696 0 170.496-76.288 171.008-170.496V191.488H384.512c-94.208 0-171.008 76.288-171.008 171.008v470.016z" p-id="5383" fill="#009688"></path><path d="M512 676.352c-20.48 0-40.448-4.096-58.88-11.776-17.92-7.68-34.304-18.432-48.128-32.768-59.904-58.88-59.904-155.136-0.512-214.528 6.144-6.144 12.288-11.264 19.456-16.384 5.632-3.072 12.8-1.536 16.384 4.096 3.072 5.12 2.048 11.264-2.56 14.848-16.384 11.776-29.696 27.136-38.912 44.544-9.728 18.432-14.848 38.912-14.848 59.392 0 34.304 13.312 66.56 37.376 90.624 24.064 24.064 56.832 37.888 90.624 37.376 34.304 0 66.56-13.312 90.624-37.376 24.064-24.064 37.376-56.832 37.376-90.624 0-20.48-5.12-40.96-14.848-59.392-9.216-17.92-22.528-32.768-38.912-44.544-5.12-3.584-6.656-11.264-2.56-16.384 3.584-5.12 11.264-6.656 16.384-2.56 68.096 48.64 83.968 143.36 35.84 211.456a151.4752 151.4752 0 0 1-123.904 64z m3.584-164.864c-6.656 0-11.776-5.12-11.776-11.776V358.912c0.512-6.656 5.632-11.776 12.288-11.264 6.144 0.512 11.264 5.12 11.264 11.264v140.8c0 6.656-5.12 11.776-11.776 11.776z" p-id="5384" fill="#009688"></path><path d="M512 679.936h-3.584c-19.968-0.512-38.912-4.608-56.832-12.288-18.432-7.68-35.328-18.944-49.664-33.28-29.184-29.184-45.568-68.096-45.568-109.568 0-41.472 15.872-80.384 45.056-109.568 6.144-6.144 12.8-11.776 19.968-16.896 7.68-4.608 17.408-2.048 21.504 5.632 3.584 6.656 2.56 14.848-3.072 19.456-15.872 11.776-29.184 26.624-38.4 43.52-9.216 17.92-14.336 37.888-14.336 57.856 0 33.28 12.8 64.512 36.352 88.064 23.04 23.04 55.296 36.352 87.552 36.352h0.512c33.28 0 64.512-12.8 88.064-36.352 23.04-23.04 36.352-55.296 36.352-88.064 0-19.968-4.608-39.936-14.336-57.856-9.216-16.896-22.016-32.256-37.888-43.52-7.168-5.12-8.704-14.848-3.584-21.504 2.56-3.584 6.144-5.632 10.24-6.144 4.096-0.512 8.192 0.512 11.264 2.56 69.632 49.664 86.016 146.432 36.352 216.064-5.12 7.168-10.752 13.824-16.896 19.968-28.16 29.184-68.096 45.568-109.056 45.568zM429.568 402.944c-1.536 0-3.072 0.512-4.096 1.024-6.656 4.608-12.8 10.24-18.432 15.872-57.856 57.856-57.344 151.552 0.512 209.408 13.824 13.824 29.184 24.064 47.104 31.744 18.432 7.68 37.888 11.776 57.856 11.776h3.072c37.888-0.512 75.264-16.384 101.888-43.52 5.632-5.632 11.264-12.288 15.872-18.944 47.104-66.56 31.744-159.232-34.816-206.336-3.584-2.56-8.704-2.048-11.776 2.048-2.56 3.584-2.048 8.704 2.048 11.776 16.384 11.776 30.72 27.648 39.936 46.08 9.728 18.944 15.36 39.936 14.848 60.928 0 34.816-13.824 68.608-38.4 93.184-25.088 25.088-57.856 38.4-93.184 38.4h-0.512c-34.816 0-68.608-13.824-92.672-38.4-25.088-25.088-38.4-57.856-38.4-93.184 0-20.992 5.12-42.496 14.848-60.928 9.728-17.92 23.552-33.792 39.936-46.08 2.56-2.56 3.584-6.656 1.536-10.24-1.536-3.072-4.096-4.608-7.168-4.608z m86.016 112.128c-4.096 0-8.192-1.536-10.752-4.608-3.072-3.072-4.608-6.656-4.608-10.752V358.912c0-4.096 2.048-8.192 5.12-10.752s7.168-4.096 11.264-4.096c8.192 0.512 14.336 6.656 14.848 14.848v140.8c-0.512 8.704-7.168 15.36-15.872 15.36z m0-163.84c-2.048 0-4.096 0.512-5.632 2.048-1.536 1.536-2.56 3.584-2.56 5.632v140.288c0 2.048 1.024 4.096 2.56 5.632 1.536 1.536 3.584 2.56 5.632 2.56 4.608 0 8.192-3.584 8.192-8.192V358.912c0-4.096-3.584-7.68-8.192-7.68z" p-id="5385" fill="#009688"></path></svg>
                </a>
            </li>
        </ul>
    </div>

    <!--按钮区域-->
    <div class="layui-row">
        <div class="layui-col-md9" style="height: 45px;">
            <div class="layui-btn-group" id="addBtnList" style="line-height: 45px;padding-left: 10px;">
                <button type="button" onclick="route('/root',2)" class="layui-btn layui-btn-sm">返回 ~</button>
                <button type="button" onclick="route('/',2)" class="layui-btn layui-btn-sm">返回 /</button>
                <button type="button" onclick="route('../',1)" class="layui-btn layui-btn-sm">返回 ../</button>
                <button type="button" onclick="route('/home',2)" class="layui-btn layui-btn-sm">返回 /home</button>
                <button type="button" class="layui-btn layui-btn-sm" id="btnImport">
                    <i class="layui-icon">&#xe67c;</i>上传文件
                </button>
            </div>
        </div>

        <div class="layui-col-md3" style="height: 45px;text-align: right;padding-right: 10px;">
            <div class="layui-btn-group" style="line-height: 45px;padding-left: 10px;">
                <button type="button" class="layui-btn layui-btn-sm" onclick="xadmin.open('按钮管理 (按钮层)','/addBtnManagement',900,550)" style="bottom: 0;">
                    <i class="layui-icon layui-icon-set-fill"></i> 按钮管理
                </button>
                <button type="button" class="layui-btn layui-btn-sm" onclick="xadmin.open('添加快捷按钮','/addBtn',500,325)" style="bottom: 0;">
                    <i class="layui-icon layui-icon-add-circle-fine layui-font-15"></i> 增加新的快捷按钮
                </button>
            </div>
        </div>
    </div>


    <!--路径显示区域-->
    <div class="layui-row">
        <div class="layui-row" style="padding-left: 10px;">
            <span class="layui-badge layui-bg-cyan" id="userName" th:text="${connectType}+':'+${userName}"></span>
            <span class="layui-badge layui-bg-cyan" id="badgePath" style="cursor: pointer;">路径:
					<span id="currentDirectory">/</span>
			</span>
            <input type="text" id="inputPath" style="height: 14px;width: 300px;position: absolute;margin-left: 4px;display: none;"/>
        </div>
    </div>

    <!--显示区域-->
    <div class="layui-row show-div-par" >
        <div class="layui-col-md12 show-div" >
            <!--文件显示-->
            <div id="dataList"></div>
        </div>

        <!--右键菜单-->
        <div id="menu">
            <div class="menu" onclick="down()">下载</div>
            <div class="menu" id="fileDelete">删除</div>
            <div class="menu" id="fileRename">重命名</div>
            <div class="menu" id="fileAttribute">属性</div>
        </div>
    </div>

    <!--命令输入区域-->
    <div class="layui-row" style="height: 38px;">
        <input type="text" id="order" spellcheck="false" name="title"  placeholder="请输入命令 请点击 '查看命令' 来使用命令" autocomplete="off" class="layui-input">
    </div>

    <!--日志区域-->
    <div class="layui-row" >
        <div class="layui-col-md12" >

            <div class= "nav_wrap">
                <ul class= "nav_ul">
                </ul>
            </div>


        </div>
    </div>

</div>
<script type="module" th:src="@{/js/web.js}"></script>
<script type="module" th:src="@{/js/principal/principal.js}"></script>
<script type="text/javascript" th:src="@{/js/index.js}"></script>

</body>



</html>
